<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en" dir="ltr" id="html">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<title>Test Page for Smart Queue</title>
	<link rel="stylesheet" media="screen" href="test.css" />
	<script type="text/javascript" src="../build/smart-queue.source.js"></script>
	<script type="text/javascript" src="jquery-1.3.2.min.js"></script>
	<style type="text/css" media="screen">
	p { font: 12px Verdana,Arial; }
	ul { list-style-type: none; }
	</style>
</head>

<body>
	<h1>Test Page for Smart Queue</h1>
	<h2 id="testqueue">Test Queue</h2>
	<div><a href="#firedqueue">>>Fired Queue</a></div>
	<ul id="J_test_cases">
		<li>
			<pre>task = new sq.Task({fn: function() { log('unamed') }})</pre>
			<ul>
				<li>typeof task.fn === 'function'</li>
				<li>task.name === 't0'</li>
				<li>task.level === 1</li>
				<li>task.dependencies.length === 0</li>
				<li>task.context == window</li>
			</ul>
		</li>
		<li>
			<pre>task = new sq.Task({fn: function() { log('unamed') }, name: 'hello'})</pre>
			<ul>
				<li>task.name === 'hello'</li>
				<li>task.level === 1</li>
			</ul>
		</li>
		<li>
			<pre>task = new sq.Task({fn: function() { log('high level') }, name: 'hello', level: 2})</pre>
			<ul>
				<li>task.name === 'hello'</li>
				<li>task.level === 2</li>
			</ul>
		</li>
		<li>
			<pre>task = new sq.Task({fn: function() { log('low level') }, name: '', level: 0})</pre>
			<ul>
				<li>task.name === 't1'</li>
				<li>task.level === 0</li>
			</ul>
		</li>
		<li>
			<pre>task = new sq.Task(function() { log('with dep') }, 1, 'tail', ['next'])</pre>
			<ul>
				<li>task.name === 'tail'</li>
				<li>task.dependencies[0] === 'next'</li>
			</ul>
		</li>
		<li>
			<pre>task = new sq.Task({fn: function() { log('depended') }, name: 'next', dependencies: ['first']})</pre>
			<ul>
				<li>task.name === 'next'</li>
				<li>task.dependencies[0] === 'first'</li>
			</ul>
		</li>
		<li>
			<pre>task = new sq.Task({fn: function() { log('another dep') }, dependencies: ['next', 't0']})</pre>
			<ul>
				<li>task.name === 't2'</li>
				<li>task.dependencies.length === 2</li>
			</ul>
		</li>
		<li>
			<pre>task = new sq.Task({fn: function() { log('first') }, name: 'first', dependencies: ['unknown']})</pre>
			<ul>
				<li>task.name === 'first'</li>
				<li>task.dependencies.length === 1</li>
			</ul>
		</li>
		<li>
			<pre>task = new sq.Task({fn: function() { log('chars: ' + this.nodename.length) }, context: document.getElementById('J_test_cases')})</pre>
			<ul>
				<li>task.name === 't3'</li>
				<li>task.context.nodename === $('#J_test_cases')[0].nodename</li>
			</ul>
		</li>
		<li>
			<pre>task = new sq.Task({fn: function() { log('chars: ' + this.nodename.length) }, context: document.getElementById('J_test_cases'), data: {num1: 1, num2: 2}})</pre>
			<ul>
				<li>task.name === 't4'</li>
				<li>task.data.num1 + task.data.num2 === 3</li>
			</ul>
		</li>
	</ul>
	<h2 id="firedqueue">Fired Queue</h2>
	<div><a href="#testqueue">>>Test Queue</a></div>
	<textarea id="placeholder" rows="10" cols="80"></textarea>

	<script type="text/javascript">
		var node = document.getElementById('placeholder');
		node.value = '';
		function log(str) {
			node.value += str + '\n';
		}
		function assert(expression) {
			var flag;
			eval('flag = ' + expression);
			return typeof(flag) === 'boolean' && flag;
		}
		
		var sq = SmartQueue, task, total = 0, passed = 0, failed = 0;
		$('#J_test_cases').children().each(function(index) {
			eval($('pre', this).text());
			task.register();
			$('li', this).each(function() {
				var item = $(this);
				var flag = assert(item.text());
				if(flag) passed ++; else failed ++;
				item.prepend((flag ? '<font color="green">[PASS]</font>' : '<font color="red">[FAIL]</font>') + ' ');
				total++;
			}).wrap('<pre></pre>');
		}).end().before('<p>Total: ' + total + ', passed: '+ passed +', failed: ' + failed + '</p>');
		sq.fire();
	</script>
</body>
</html>
